<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/mine.css">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.css">
    <script src="js/mine.js"></script>
    <title>我的</title>
</head>
<body>
    <div class="wrapper">
<!--        头部-->
        <div class="header-wrapper" id="header-wrapper">
            <div class="header" id="header">
                <div class="header-left">
                    <img src="img/mine-头像.png" alt="" id="header-img">
                    <p>forgot257</p>
                </div>
                <div class="header-right">
                    <i class="fa fa-cog"></i>
                    <i class="fa fa-bell-o"></i>
                </div>
            </div>
        </div>

<!--        主体部分-->
        <div class="main">
            <div class="module1">
                <div class="module1-left">
                    <div>
                        <div><i class="fa fa-vimeo"></i></div>
                        <span>美团会员</span>
                        <p>已过期</p>
                    </div>
                    <div>
                        开通会员预计可省<span>161</span>元/月
                    </div>
                </div>
                <div class="module1-right">立即开通</div>
            </div>
            <div class="module2">
                <p class="module2-1">我的资产</p>
                <div class="module2-2">
                    <div>
                        <span><img src="img/mine-红包神券.png" alt=""> 红包/神券</span>
                        <p><span class="number">8</span> 个未使用</p>
                    </div>
                    <div>
                        <span><img src="img/mine-代金券.png" alt=""> 代金券</span>
                        <p><span class="number">1</span> 张未使用</p>
                    </div>
                    <div>
                        <span><img src="img/mine-津贴.png" alt=""> 津贴</span>
                        <p><span class="number">20</span> 元可叠加减免</p>
                    </div>
                    <div>
                        <span><img src="img/mine-米粒.png" alt=""> 米粒</span>
                        <p><span class="number">0</span> 个未使用</p>
                    </div>
                    <div>
                        <span><img src="img/mine-立减金.png" alt=""> 立减金</span>
                        <p>领订单返利</p>
                    </div>
                </div>
            </div>
            <div class="module3">
                <p>我的收藏</p>
                <div class="module3-list">
                    <img src="img/mine-御味牛排烤肉饭.png" alt="">
                    <img src="img/mine-京小丫.png" alt="">
                    <img src="img/mine-御味牛排烤肉饭.png" alt="">
                    <div class="module3-zhezhao">5家店铺  <i class="fa fa-angle-right"></i></div>
                </div>

            </div>
            <div class="module4">
                <div class="module4-part1">
                    <p>我的钱包</p>
                    <div>
                        <span>进入钱包</span>
                        <i class="fa fa-circle"></i>
                        <i class="fa fa-angle-right"></i>
                    </div>
                </div>
                <div class="module4-part2">
                    <div class="part2-wrapper">
                        <p class="part2-line1">1 <span>次</span></p>
                        <p class="part2-line2">霸王餐</p>
                        <p class="part2-line3">申请卡奖励</p>
                        <div>未领取</div>
                    </div>
                    <div class="part2-wrapper">
                        <p class="part2-line1">5000 <span>元</span></p>
                        <p class="part2-line2">美团借钱</p>
                        <p class="part2-line3">大约可借</p>
                    </div>
                    <div class="part2-wrapper">
                        <p class="part2-line1">2 <span>张</span></p>
                        <p class="part2-line2">外卖神券</p>
                        <p class="part2-line3">待领取</p>
                        <div>1</div>
                    </div>
                    <div class="part2-wrapper">
                        <p class="part2-line1">6 <span>元</span></p>
                        <p class="part2-line2">待领取</p>
                        <p class="part2-line3">银行优惠</p>
                    </div>
                </div>
            </div>
            <div class="module567">
                <p>我的功能</p>
                <div class="module567-list">
                    <div>
                        <img src="img/mine-我的地址.png" alt="">
                        <span>我的地址</span>
                    </div>
                    <div>
                        <img src="img/mine-我的足迹.png" alt="">
                        <span>我的足迹</span>
                    </div>
                    <div>
                        <img src="img/mine-答谢记录.png" alt="">
                        <span>答谢记录</span>
                    </div>
                    <div>
                        <img src="img/mine-我的评价.png" alt="">
                        <span>我的评价</span>
                    </div>
                    <div>
                        <img src="img/mine-发票助手.png" alt="">
                        <span>发票助手</span>
                    </div>
                    <div>
                        <img src="img/mine-集点返券.png" alt="">
                        <span>集点返券</span>
                    </div>
                    <div>
                        <img src="img/mine-企业用餐.png" alt="">
                        <span>企业用餐</span>
                    </div>
                    <div>
                        <img src="img/mine-无障碍外卖.png" alt="">
                        <span>无障碍外卖</span>
                    </div>
                </div>
            </div>
            <div class="module567">
                <p>我的服务</p>
                <div class="module567-list">
                    <div>
                        <img src="img/mine-帮助与反馈.png" alt="">
                        <span>帮助与反馈</span>
                    </div>
                    <div>
                        <img src="img/mine-客服中心.png" alt="">
                        <span>客服中心</span>
                    </div>
                    <div>
                        <img src="img/mine-垃圾分类.png" alt="">
                        <span>垃圾分类</span>
                    </div>
                </div>
            </div>
            <div class="module567">
                <p>更多推荐</p>
                <div class="module567-list">
                    <div>
                        <img src="img/mine-邀请有奖.png" alt="">
                        <span>邀请有奖</span>
                    </div>
                    <div>
                        <img src="img/mine-商家入驻.png" alt="">
                        <span>商家入驻</span>
                    </div>
                    <div>
                        <img src="img/mine-骑手招募.png" alt="">
                        <span>骑手招募</span>
                    </div>
                    <div>
                        <img src="img/mine-合作招聘.png" alt="">
                        <span>合作/招聘</span>
                    </div>
                    <div>
                        <img src="img/mine-美团公益.png" alt="">
                        <span>美团公益</span>
                    </div>
                    <div>
                        <img src="img/mine-能量捐赠.png" alt="">
                        <span>能量捐赠</span>
                    </div>
                    <div>
                        <img src="img/mine-餐饮加盟.png" alt="">
                        <span>餐饮加盟</span>
                    </div>
                    <div>
                        <img src="img/mine-福利专享.png" alt="">
                        <span>福利专享</span>
                    </div>
                    <div>
                        <img src="img/mine-福利月月领.png" alt="">
                        <span>福利月月领</span>
                    </div>
                    <div>
                        <img src="img/mine-代运营商招聘.png" alt="">
                        <span>代运营商招募</span>
                    </div>
                    <div>
                        <img src="img/mine-美团电商招商.png" alt="">
                        <span>美团电商招商</span>
                    </div>
                    <div>
                        <img src="img/mine-小美陪审团.png" alt="">
                        <span>小美陪审团</span>
                    </div>
                </div>
            </div>
        </div>

<!--        底部-->
        <div class="footer-wrapper">
            <div class="footer">
                <div onclick="window.location.href='index.html' ">
                    <i class="fa fa-home fa-3x"></i>
                    <span>首页</span>
                </div>
                <div onclick="window.location.href='vip.html' ">
                    <i class="fa fa-vimeo fa-3x"></i>
                    <span>会员</span>
                </div>
                <div onclick="window.location.href='order.html' ">
                    <i class="fa fa-file-text-o fa-3x"></i>
                    <span>订单</span>
                </div>
                <div  onclick="window.location.href='mine.html' ">
                    <i class="fa fa-user fa-3x"></i>
                    <span>我的</span>
                </div>
            </div>
        </div>
    </div>

</body>

</html>